layui.use([ 'form', 'step','layer'], function () {
    var $ = layui.$,
        form = layui.form,
        layer = layui.layer,
        step = layui.step;

    var userInfo = null;
    var userEmail = null;

    //自定义表单验证规则
    form.verify({
        repass : function (value,item) {
            let password = $("input[name='userPasswd']").val();
            if (value !=  password){
                return "两次密码不一致！";
            }
        }
    });

    step.render({
        elem: '#stepForm',
        filter: 'stepForm',
        width: '100%', //设置容器宽度
        stepWidth: '950px',
        height: '500px',
        stepItems: [{
            title: '填写基本信息'
        }, {
            title: '验证邮箱'
        }, {
            title: '收集兴趣爱好'
        }, {
            title: '完成'
        }]
    });

    //发送验证码绑定事件

    form.on('submit(sendEmail)', function (data) {
        $.post("/sendAuthCode/"+data.field.userEmail, function(data) {
            if (data.code == '0'){
                layer.msg("验证码发送成功！",{icon:6});
            }else {
                layer.msg(data.msg,{icon:5});
            }
        });
        return false;
    });

    form.on('submit(formStep)', function (data) {
        userInfo = data.field;
        step.next('#stepForm');
        return false;
    });

    form.on('submit(authEmailCode)', function (data) {

        $.ajax({
            url:'/authCodeMatching',
            type:'POST', //GET
            async:true,    //或false,是否异步
            data: JSON.stringify(data.field),
            timeout:5000,    //超时时间
            dataType:'json',    //返回的数据格式：json/xml/html/script/jsonp/text
            contentType: "application/json",
            success:function(res){
                if (res.code == '0'){
                    layer.msg("邮箱验证成功！",{icon:6});
                    userEmail = data.field;
                    step.next('#stepForm');
                }else {
                    layer.msg("验证失败,验证码错误或验证码超时，请重试！",{icon:5});
                }
            }
        });
        return false;

    });

    form.on('submit(endSubmit)', function (data) {

        var arr = '';
        $("input:checkbox[name='userHobbys']:checked").each(function(i){
            arr += $(this).val()+',';
        });

        userInfo.userEmail = userEmail.userEmail;
        userInfo.userHobbys = arr;

        $.ajax({
            url:'/member/register',
            type:'POST', //GET
            async:true,    //或false,是否异步
            data: JSON.stringify(userInfo),
            timeout:5000,    //超时时间
            dataType:'json',    //返回的数据格式：json/xml/html/script/jsonp/text
            contentType: "application/json",
            success:function(res){
                if (res.code == '0'){
                    step.next('#stepForm');

                }else {
                    layer.msg(res.msg,{icon:5});
                }
            }
        });

        return false;
    });

    //查询兴趣列表
    var queryHobbyList = function(){
        $.post("/hobby/list", function(data) {
            renderData(data.data)
        });
    };

    var renderData = function (data){
        var html = '';
        $.each(data,function (index,value) {
            html +=  '<input type="checkbox" value="'+ value.hobbyId +'"  name="userHobbys" title="'+ value.hobbyName +'">';
        });

        $('#hobbyCheckBox').html(html);
        form.render();
    };


    $('.pre').click(function () {
        step.pre('#stepForm');
    });

    $('.next').click(function () {
        step.next('#stepForm');
    });

    queryHobbyList();
})